import React,{useContext,Component} from 'react'
import {TodolistContext} from './context'

// //类组件
// class List extends Component{
//     //只要给组件设置静态属性contextType，就能从实例的context属性获取值
//     static contextType = TodolistContext;
//     render(){
//         console.log(this.context);
//         return(
//             <ul>
//                 <li></li>
//             </ul>
//         )
//     }
// }

// 函数组件
const List = () => {
    const {list} = useContext(TodolistContext)
    return (
            <ul>
                {
                    // list.map((item,index)=><li key={index}>{item}</li>)
                }
                <TodolistContext.Consumer>
                    {
                        ({list})=>{
                            return list.map((item,index)=><li key={index}>{item}</li>)
                        }
                    }
                </TodolistContext.Consumer>
            </ul>
    )
}
export default List